// axios基础的封装

//ElMessage和element-plus/theme-chalk/el-message.css这个配套
import { ElMessage } from "element-plus";
import 'element-plus/theme-chalk/el-message.css'
import { useUserStore } from "@/stores/userStore";

//vue3不能在setup外使用useRouter,所以要导入@/router
import router from "@/router";
import axios from "axios";
const request = axios.create({
  baseURL: "http://pcapi-xiaotuxian-front-devtest.itheima.net",
  timeout: 5000,
});

// 拦截器

// axios请求拦截器
request.interceptors.request.use(
  (config) => {
    //从pinia获取token数据
    const userStore = useUserStore();
    const token = userStore.userInfo.token
    if(token){
      config.headers.Authorization=`Bearer ${token}`
    }
    //2.按照后端的要求拼接token数据
    return config;
  },
  (e) => Promise.reject(e)
);

// axios响应式拦截器
request.interceptors.response.use(
  (res) => res.data,
  (e) => {
    //从pinia获取token数据
    const userStore = useUserStore();
    // 统一错误提示
    ElMessage({
      type: "warning",
      message: e.response.data.message,
    });

    //401token失效处理
    //1. 清除本地用户数据
    //2.跳转登录页
    if (e.response.status === 401) {
      userStore.clearUserInfo()
      router.push('/login')
    }

    return Promise.reject(e);
  }
);

export default request;
